<?php
$cdnUrl='./';
$cdnjsUrl='http://tu-10030004.file.myqcloud.com/wakeupin/';
$appId='wxe214ac48790c622f';
$secret='6b7153fc9c94ee2008e71ecbb2313bec';
include 'jssdk.php';
$jssdk = new JSSDK($appId, $secret);
$signPackage = @$jssdk->GetSignPackage();
$ids='d';
if (isset($_GET['id'])){
  $ids=$_GET['id'];
}
$uid=$ids.'-'.uniqid();
?><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>2022年，探寻你的灵魂漫游目的地</title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<style>
html,body{width:100%;font-size:12px;font-family:Helvetica,Tahoma, Arial, STXihei,Microsoft YaHei, Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;}
body{-webkit-overflow-scrolling: touch;overflow-scrolling: touch;overflow-y: scroll;max-width:750px;}
body, div{padding:0px;margin:0px auto;}
.weui-dialog{position:fixed;z-index:5000;width:80%;max-width:300px;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:#FFF;text-align:center;border-radius:3px;overflow:hidden}.weui-dialog__hd{padding:1.3em 1.6em .5em}.weui-dialog__title{font-weight:400;font-size:18px}.weui-dialog__bd{padding:0 1.6em .8em;min-height:40px;font-size:15px;line-height:1.3;word-wrap:break-word;word-break:break-all;color:#999}.weui-dialog__bd:first-child{padding:1.2em 20px .1em;color:#353535}.weui-dialog__ft{position:relative;line-height:48px;font-size:18px;display:-webkit-box;display:-webkit-flex;display:flex}.weui-dialog__ft:after{content:" ";position:absolute;left:0;top:0;right:0;height:1px;border-top:1px solid #D5D5D6;color:#D5D5D6;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}.weui-dialog__btn{display:block;-webkit-box-flex:1;-webkit-flex:1;flex:1;color:#3CC51F;text-decoration:none;-webkit-tap-highlight-color:transparent;position:relative}.weui-dialog__btn:active{background-color:#EEE}.weui-dialog__btn:after{content:" ";position:absolute;left:0;top:0;width:1px;bottom:0;border-left:1px solid #D5D5D6;color:#D5D5D6;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleX(.5);transform:scaleX(.5)}.weui-dialog__btn:first-child:after{display:none}.weui-dialog__btn_default{color:#353535}.weui-dialog__btn_primary{color:#0BB20C}@media screen and (min-width:1024px){.weui-dialog{width:35%}}.weui-mask{position:fixed;z-index:1000;top:0;right:0;left:0;bottom:0;background:rgba(0,0,0,.6)}
.weui-mask_transparent{position:fixed;z-index:1000;top:0;right:0;left:0;bottom:0}
.js_dialog{display:none;}
.jie{
-webkit-touch-callout:none;
-webkit-user-select:none;
-webkit-text-size-adjust: none;
-webkit-touch-callout:none; /*系统默认菜单被禁用*/
-webkit-user-select:none; /*webkit浏览器*/
-khtml-user-select:none; /*早期浏览器*/
-moz-user-select:none;/*火狐*/
-ms-user-select:none; /*IE10*/
user-select:none;
}
html{-ms-touch-action:none;}
div:focus, img:focus{
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-user-modify:read-write-plaintext-only; 
}
div,img,html,body{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-touch-callout:none;}
.simg{position:absolute;display:block;}
a{text-decoration:none;}
.txt{position:absolute;text-align:center;color:#fff;font-size:12px;z-index:2;border:none;background:transparent;padding:0;}
.txt::-webkit-input-placeholder{color:#a3a0a0;text-align:center;}
select{position:absolute;color:#787c7f;display:block;background:transparent;border:0px;text-indent:4px;font-size:12px;-webkit-appearance:none;}
.container{position:relative;width:100%;transform:translate3d(0,0,0);width:100%;height:100%;overflow:hidden;}
.p-b, .thebg{position:absolute;width:100%;top:0;left:0;}
.p-b{height:100%;}
.thebg{height:100%;}
.page, .home, .jie{position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;}
.home, .canvas-bg{opacity:0;}
.jiebox{position:absolute;width:100%;height:100%;top:0;left:0;}
.canvas-bg, .canvas-user{position:absolute;width:100%;height:100%;top:0;left:0;}
.page{display:none;}
.ltop{top:0;}
.w100, .ltop, .p1-bg{position:absolute;width:100%;left:0;display:block;}
.p1-bg{bottom:0;}
@keyframes fadeInDown{
  from {
    opacity: 0;
    transform: translate3d(0, -10%, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
.fadeInDown {
  animation-name: fadeInDown;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  animation-name: fadeIn;
}
@keyframes pulse {
  0% {transform: scale3d(1, 1, 1);}
  25% {transform: scale3d(1.1, 1.1, 1.1);}
  50% {transform: scale3d(1, 1, 1);}
  75% {transform: scale3d(1.1, 1.1, 1.1);}
  100% {transform: scale3d(1, 1, 1);} 
}
.pulse {
  animation-name: pulse;
  animation-timing-function: ease-in-out;
}
.ani6{
  -webkit-animation-duration: .6s;animation-duration: .6s;
  -webkit-animation-fill-mode: both;animation-fill-mode: both;
}
.animated{
  -webkit-animation-duration: .9s;animation-duration: .9s;
  -webkit-animation-fill-mode: both;animation-fill-mode: both;
}
.ani15{
  -webkit-animation-duration: 1.5s;animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;animation-fill-mode: both;
}
.ani3{-webkit-animation-duration: 3s;animation-duration: 3s;
  -webkit-animation-fill-mode: both;animation-fill-mode: both;}
.animated.d5s{animation-delay: .5s;}
.animated.d6s{animation-delay: .6s;}
.animated.d8s{animation-delay: .8s;}
.animated.d1s{animation-delay: 1s;}
.ani3.d15s{animation-delay: 1.5s;}
.animated.infinite, .ani3.infinite{-webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;}
.home-btn{position:absolute;}
.p1-r1-tu, .p1-r2-tu{position:absolute;width:100%;top:0;left:0;}
@keyframes swing3 {
  00% {
    transform: rotate3d(0, 0, 1, 0deg);
  }

  30% {
    transform: rotate3d(0, 0, 1, -.2deg) translate3d(-.2px, -.2px, 0);
  }

  60% {
    transform: rotate3d(0, 0, 1, .2deg) translate3d(.2px, .2px, 0);
  }

  90% {
    transform: rotate3d(0, 0, 1, -.2deg) translate3d(-.2px, -.2px, 0);
  }

  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
.swing3{
  transform-origin: top center;
  animation-name: swing3;
}

@keyframes swing2 {
  20% {
    transform: rotate3d(0, 0, 1, 3deg) translate3d(-1px, -1px, 0);
  }

  40% {
    transform: rotate3d(0, 0, 1, -3deg) translate3d(-1px, -1px, 0);
  }

  60% {
    transform: rotate3d(0, 0, 1, 1deg) translate3d(1px, 1px, 0);
  }

  80% {
    transform: rotate3d(0, 0, 1, -1deg) translate3d(1px, 1px, 0);
  }

  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
.swing2 {
  transform-origin: top center;
  animation-name: swing2;
}

@keyframes flash {
  0%{opacity: 1;}
  20%{opacity: 0;}
  40%{opacity: 1;}
  100%{opacity: 1;}
}
.flash {
  animation-name: flash;
}
@keyframes swing {
  20% {
    transform: rotate3d(0, 0, 1, 5deg) translate3d(-5px, -5px, 0);
  }
  40% {
    transform: rotate3d(0, 0, 1, -5deg) translate3d(-5px, -5px, 0);
  }
  60% {
    transform: rotate3d(0, 0, 1, 1deg) translate3d(5px, 5px, 0);
  }
  80% {
    transform: rotate3d(0, 0, 1, -1deg) translate3d(5px, 5px, 0);
  }
  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 80deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 5deg);
    opacity: 1;
  }

  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    transform: perspective(400px);
  }
}
.flipInY {
  backface-visibility: visible !important;
  animation-name: flipInY;
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-60%, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  animation-name: fadeInLeft;
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(60%, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  animation-name: fadeInRight;
}

.swing {
  transform-origin: top center;
  animation-name: swing;
}

.p1-r1{-webkit-animation: swing 3s linear infinite -0.8s;animation: swing 3s linear infinite -0.8s;}
.p1-r2{-webkit-animation: swing 3s linear infinite -0.2s;animation: swing 3s linear infinite -0.2s;}
.p1-r3{-webkit-animation: swing 6s linear infinite -0.2s;animation: swing 6s linear infinite -0.4s;}

.p2-r1, .p2-r2, .p4-r1, .p4-r2, .p6-r1, .p6-r2, .p7-r1, .p7-r2, .p8-r1, .p8-r2, .p9-r1, .p9-r2{-webkit-animation: swing3 3s linear infinite -0.8s;animation: swing3 3s linear infinite -0.8s;}
.user-input img, .user-input input{width:100%;position:absolute;height:100%;top:0;left:0;}

.txt::placeholder{color:#34388e;text-align: center;}
.txt::-webkit-input-placeholder{color:#34388e;text-align: center;}
.p5-ta{transform:translateX(-1000px);}
.p5-tb{transform:translateX(1000px);}
.mus, .mus-box{position:absolute;z-index:2;top:0;right:0;}
.mus{width:100%;height:auto;}
@-webkit-keyframes rotate{ from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);} }
.gorotate{animation: rotate 3s linear infinite;-webkit-animation: rotate 3s linear infinite;}
.jie-last{position:absolute;width:100%;bottom:0;left:0;}
.jie-name{position:absolute;width:100%;text-align:center;display:flex;align-items:flex-end;color: #003e7e;font-size:14px;justify-content:center;}
.jie-tu{display:block;width:100%;}
.jie-t1{height:auto;}
@font-face{
  font-style: normal;
  font-family: 'mou';
  src:url('a.ttf') format('truetype');
}
.jie-name{font-family:"mou","Microsoft YaHei",sans-serif;font-weight:600;}
.p3-press{position: absolute;width: 100%;height: 100%;opacity:0;}
.jie-bottom{position:absolute;width:100%;height:auto;left:0;bottom:0;background-color:#fff;display:none;}
.jie-btn{width:100%;display:block;height:auto;position:absolute;left:0;}
.user-input input{background:transparent;color: #0812f3;text-align: center;font-size:14px;font-family:"mou","Microsoft YaHei",sans-serif;}
</style><script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?adf2f5a0564fe5e5748b8365d3ef8b4b";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body>
<div class="container">
<div class="home">
   <img class="home-b p-b w100 ani15 d3s fadeIn" id="p1-b" src="./img/index.jpg">
   <canvas id="canvas-bg" width="750" height="1448" class="canvas-bg"></canvas>
   <div class="thebg"> 
     <img class="home-t1 w100 flipInY ani15" src="<?php echo $cdnjsUrl ?>img/home-t1-2.png">
     <img class="home-btn ani3 pulse infinite" src="<?php echo $cdnjsUrl ?>img/home-btn.png">
   </div>
   <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>
<div class="p1 page">
    <img class="p1-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p1.jpg">
    <div class="p1-r2 simg">
        <img class="p1-r2-tu" src="<?php echo $cdnjsUrl ?>img/p1-r2.png">
        <img class="p1-y2 simg flash ani3 infinite d15s" src="<?php echo $cdnjsUrl ?>img/p1-y2.png">
     </div>
     <div class="p1-r1 simg">
        <img class="p1-r1-tu" src="<?php echo $cdnjsUrl ?>img/p1-r1.png">
        <img class="p1-y1 simg flash ani3 infinite" src="<?php echo $cdnjsUrl ?>img/p1-y1.png">
     </div>
    <div class="thebg">
     <img class="p1-r3 simg" src="<?php echo $cdnjsUrl ?>img/p1-r3.png">

     <img class="p1-t1 w100" src="<?php echo $cdnjsUrl ?>img/p1-t1.png">
     <img class="p1-t2 w100" src="<?php echo $cdnjsUrl ?>img/p1-t2.png">
     <img class="p1-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p1-a.png">
     <img class="p1-tb simg fadeInRight animated d6s" src="<?php echo $cdnjsUrl ?>img/p1-b.png">
      
   </div>
   <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
  
</div>

<div class="p2 page">
    <img class="p2-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p2.jpg">
    <div class="p2-r2 simg">
        <img class="p1-r1-tu" src="<?php echo $cdnjsUrl ?>img/p2-r2.png">
        <img class="p2-y2 simg flash ani3 infinite d15s"  src="<?php echo $cdnjsUrl ?>img/p2-y2.png">
      </div>
      <div class="p2-r1 simg">
        <img class="p1-r1-tu" src="<?php echo $cdnjsUrl ?>img/p2-r1.png">
        <img class="p2-y1 simg flash ani3 infinite" src="<?php echo $cdnjsUrl ?>img/p2-y1.png">
      </div>
    
    <div class="thebg">
      <img class="p2-t1 w100" src="<?php echo $cdnjsUrl ?>img/p2-t1.png">
      <img class="p2-t2 w100" src="<?php echo $cdnjsUrl ?>img/p2-t2.png">
      <img class="p2-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p2-a.png">
      <img class="p2-tb simg fadeInRight  animated d6s" src="<?php echo $cdnjsUrl ?>img/p2-b.png">
    </div>
    <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="p3 page">
    <img class="p2-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p3.jpg">
    <div class="thebg">
      <img class="p3-t1 w100" src="<?php echo $cdnjsUrl ?>img/p3-t1.png">
      <img class="p3-t2 w100" src="<?php echo $cdnjsUrl ?>img/p3-t2.png">
      <img class="p3-ta simg" src="<?php echo $cdnjsUrl ?>img/p3-a.png">
      <img class="p3-tb simg" src="<?php echo $cdnjsUrl ?>img/p3-b.png">
      <img class="p3-tc simg" src="<?php echo $cdnjsUrl ?>img/p3-c.png">

    </div>
    <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="p4 page">
    <img class="p4-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p4.jpg">
    <div class="p4-r2 simg">
      <img class="p1-r1-tu  flash ani3 infinite" src="<?php echo $cdnjsUrl ?>img/p4-r2.png">
      <img class="p4-y2 simg flash ani3 infinite"  src="<?php echo $cdnjsUrl ?>img/p4-y2.png">
    </div>
    <div class="p4-r1 simg">
      <img class="p1-r1-tu flash ani3 infinite d15s" src="<?php echo $cdnjsUrl ?>img/p4-r1.png">
      <img class="p4-y1 simg flash ani3 infinite d15s"  src="<?php echo $cdnjsUrl ?>img/p4-y1.png">
    </div>
    <div class="thebg">
      <img class="p4-t1 w100" src="<?php echo $cdnjsUrl ?>img/p4-t1.png">
      <img class="p4-t2 w100" src="<?php echo $cdnjsUrl ?>img/p4-t2.png">
      <img class="p4-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p4-a.png">
      <img class="p4-tb simg fadeInRight  animated d6s" src="<?php echo $cdnjsUrl ?>img/p4-b.png">
      

    </div>
    <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="p5 page">
    <img class="p5-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p5.jpg">
    <div class="thebg">
      <img class="p5-t1 w100" src="<?php echo $cdnjsUrl ?>img/p5-t1.png">
      <img class="p5-t2 w100" src="<?php echo $cdnjsUrl ?>img/p5-t2.png">
      <img class="p5-ta simg" src="<?php echo $cdnjsUrl ?>img/p5-a.png">
      <img class="p5-tb simg" src="<?php echo $cdnjsUrl ?>img/p5-b.png">

    </div>
    <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="p6 page">
    <img class="p6-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p6.jpg">
    <div class="p6-r1 simg">
        <img class="p1-r1-tu" src="<?php echo $cdnjsUrl ?>img/p6-r1.png">
        <img class="p6-y1 simg flash ani3 infinite d15s"  src="<?php echo $cdnjsUrl ?>img/p6-y1.png">
    </div>
    <div class="thebg">
      <img class="p6-t1 w100" src="<?php echo $cdnjsUrl ?>img/p6-t1.png">
      <img class="p6-t2 w100" src="<?php echo $cdnjsUrl ?>img/p6-t2.png">
      <img class="p6-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p6-a.png">
      <img class="p6-tb simg fadeInRight  animated d6s" src="<?php echo $cdnjsUrl ?>img/p6-b.png">
      <img class="p6-r2 simg" src="<?php echo $cdnjsUrl ?>img/p6-r2.png">
    </div>
    <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="p7 page">
  <img class="p7-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p7.jpg">
  <div class="p7-r1 simg">
      <img class="p1-r1-tu" src="<?php echo $cdnjsUrl ?>img/p7-r1.png">
      <img class="p7-y1 simg flash ani3 infinite"  src="<?php echo $cdnjsUrl ?>img/p7-y1.png">
  </div>
  <img class="p7-r2 simg" src="<?php echo $cdnjsUrl ?>img/p7-r2.png">
  <div class="thebg">
    <img class="p7-t1 w100" src="<?php echo $cdnjsUrl ?>img/p7-t1.png">
    <img class="p7-t2 w100" src="<?php echo $cdnjsUrl ?>img/p7-t2.png">
    <img class="p7-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p7-a.png">
    <img class="p7-tb simg fadeInRight  animated d6s" src="<?php echo $cdnjsUrl ?>img/p7-b.png">
  </div>
  <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>


<div class="p8 page">
  <img class="p8-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p8.jpg">
  <div class="p8-r2 simg">
    <img class="p1-r1-tu" src="<?php echo $cdnjsUrl ?>img/p8-r2.png">
    <img class="p8-y1 simg flash ani3 infinite"  src="<?php echo $cdnjsUrl ?>img/p8-y1.png">
  </div>
  <div class="thebg">
    <img class="p8-t1 w100" src="<?php echo $cdnjsUrl ?>img/p8-t1.png">
    <img class="p8-t2 w100" src="<?php echo $cdnjsUrl ?>img/p8-t2.png">

    <img class="p8-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p8-a.png">
    <img class="p8-tb simg fadeInRight  animated d6s" src="<?php echo $cdnjsUrl ?>img/p8-b.png">
    <img class="p8-r1 simg" src="<?php echo $cdnjsUrl ?>img/p8-r1.png">
    
  </div>
  <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="p9 page">
  <img class="p9-b p-b w100" src="<?php echo $cdnjsUrl ?>img/p9.jpg">
  <div class="p9-r2 simg">
    <img class="p1-r1-tu flash ani3 infinite d15s" src="<?php echo $cdnjsUrl ?>img/p9-r2.png">
    <img class="p9-y2 simg flash ani3 infinite d15s"  src="<?php echo $cdnjsUrl ?>img/p9-y2.png">
  </div>
  <div class="p9-r1 simg">
    <img class="p1-r1-tu flash ani3 infinite" src="<?php echo $cdnjsUrl ?>img/p9-r1.png">
    <img class="p9-y1 simg flash ani3 infinite"  src="<?php echo $cdnjsUrl ?>img/p9-y1.png">
  </div>
  <div class="thebg">
    <img class="p9-t1 w100" src="<?php echo $cdnjsUrl ?>img/p9-t1.png">
    <img class="p9-t2 w100" src="<?php echo $cdnjsUrl ?>img/p9-t2.png">
    <img class="p9-ta simg fadeInLeft  animated d6s" src="<?php echo $cdnjsUrl ?>img/p9-a.png">
    <img class="p9-tb simg fadeInRight  animated d6s" src="<?php echo $cdnjsUrl ?>img/p9-b.png">
  </div>
  <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
</div>

<div class="user page">
  <img class="p-b w100 ani15 d3s fadeIn" id="p1-b2" src="<?php echo $cdnUrl ?>img/index.jpg">
  <canvas id="canvas-user" width="750" height="1448" class="canvas-user"></canvas>
  <div class="thebg">
    <img class="user-t1 w100" src="<?php echo $cdnjsUrl ?>img/user-t1.png">
    <div class="user-input simg">
      <img src="<?php echo $cdnjsUrl ?>img/user-t2.png">
      <input id="user-name" class="txt" name="user-name" type="text" value="" placeholder="请输入昵称" />
    </div>
    <img class="user-btn simg" src="<?php echo $cdnjsUrl ?>img/user-btn.png">
    


  </div>
  <div class="mus-box"><img class="mus" src="<?php echo $cdnjsUrl ?>img/m4.png"></div>
  
</div>

<div class="jie page">
  <div class="jiebox" id="jieBox">
    <img class="p-b w100" id="jie-b1" src="<?php echo $cdnUrl ?>img/jie/1.jpg">
    <img class="jie-last" src="<?php echo $cdnUrl ?>img/jie/last.png">
    <div class="thebg">
          
         <div class="jie-t1 w100">
         <img class="jie-tu" src="<?php echo $cdnUrl ?>img/jie/j1.png">
        
         <div class="jie-name">zhizhi</div>
         </div>
    </div>
    <img class="jie-last" src="<?php echo $cdnUrl ?>img/jie/last-1.png"> 
  </div>
  <div class="jie-bottom">
       <img class="jie-btn" src="<?php echo $cdnUrl ?>img/jie-btn.png">
  </div>
  <img class="p3-press" src="<?php echo $cdnUrl ?>img/jie/1.jpg">
</div>
 
  
 
</div>
<div style="display:none;">
    <audio id="mbg" preload="auto" loop="loop"><source src="<?php echo $cdnjsUrl ?>js/m.mp3"  type="audio/mpeg"></audio>
</div>
<script src="https://mat1.gtimg.com/libs/jquery2/2.1.4/jquery2.min.js"></script>
<script src="js/html2canvas.min.js"></script>
<script src="./js/move.min.js"></script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<?php include 'js.php'; ?>
</body></html>